<template>
    <SchoolHeader :menuItemsData="menuItems" :isSticky="false" />
    <div class="main-content">
        <breadCrumb :pTitle="pTitle" :path="path" />
        <div class="rs-inner-blog yellow-color pt-100 pb-100 md-pt-70 md-pb-70" v-if="pageType == 4">
            <div class="container">
                <div class="row">
                    <div class="col-lg-9 rs-event mb-30" v-if="noticeList.length > 0">
                        <div class="blog-deatails">
                            <div class="blog-full">
                                <h2 class="title mb-40">{{ name }}</h2>
                                <div class="blog-desc">
                                    <div class="special-content">
                                        <div class="lingdao mb-40">
                                            <div class="container">
                                                <div class="row lingdao-inner pt-40 align-items-end">
                                                    <div class="col-md-6" v-for="(item, index) in noticeList">
                                                        <img :src="item.cover" class="mb-20" v-show="index < 2">
                                                        <h4>{{ item.title }}</h4>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                            <div class="album-list"></div>
                        </div>
                    </div>
                    <div class="col-lg-9 rs-event mb-30" v-else>
                        <div class="nodata">暂无记录...</div>
                    </div>
                    <div class="col-lg-3 col-md-12 order-last">
                        <widgetArea :pTitle="pTitle" :menuItem="menuItem" />
                    </div>
                </div>
            </div>
        </div>
        <div class="rs-gallery yellow-color pt-100 pb-100 md-pt-70 md-pb-70" v-if="pageType == 3">
            <div class="container">
                <div class="row">
                    <div class="col-lg-9 rs-event mb-30" v-if="noticeList.length > 0">
                        <div class="row"><!---->
                            <div class="col-lg-4 mb-30 col-md-6"  v-for="(item, index) in noticeList">
                                <div class="gallery-item">
                                    <div class="gallery-img">
                                        <a :href="item.url">
                                            <img :src="item.cover" alt=""></a>
                                    </div>
                                    <div class="title">
                                        {{ item.title }}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-9 rs-event mb-30" v-else>
                            <div class="nodata">暂无记录...</div>
                        </div>
                        <div class="col-lg-3 col-md-12 order-last">
                            <widgetArea :pTitle="pTitle" :menuItem="menuItem" />
                        </div>
                </div>
            </div>
        </div>
            <div class="rs-inner-blog yellow-color pt-100 pb-100 md-pt-70 md-pb-70" v-if="pageType == 2">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-9 rs-event mb-30">
                            <div class="blog-deatails" v-if="noticeList.length > 0">
                                <div class="blog-full">
                                    <h2 class="title mb-40">{{ noticeList[0].title }}</h2>
                                    <ul class="single-post-meta">
                                        <li><span class="p-date"><i class="fa fa-calendar-check-o"></i> {{
                                                noticeList[0].createTime }}</span>
                                        </li>
                                    </ul>
                                    <div class="blog-desc" v-html="noticeList[0].content">
                                    </div>
                                    <div class="attach-list mt-30"></div>
                                </div>
                                <div class="album-list"></div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-12 order-last">
                            <widgetArea :pTitle="pTitle" :menuItem="menuItem" />
                        </div>
                    </div>
                </div>
            </div>
            <div class="rs-blog style1 modify1 rs-inner-blog yellow-color pt-100 pb-100 md-pt-70 md-pb-70"
                v-if="pageType == 1">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-9 rs-event mb-30" v-if="historyList.length > 0">
                            <div class="row">
                                <div class="events-short col-xl-6 col-lg-6 col-md-6" v-for="item in historyList">
                                    <div class="inner-box">
                                        <div class="content-part">
                                            <h4 class="title mb-0 text-ellipsis-2"><a :href="item.url"><!---->{{
                                                    item.name
                                                    }}</a>
                                            </h4>
                                        </div>
                                        <div class="date-part">
                                            {{ item.time }}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-9 rs-event mb-30" v-else>
                            <div class="nodata">暂无记录...</div>
                        </div>
                        <div class="col-lg-3 col-md-12 order-last">
                            <widgetArea :pTitle="pTitle" :menuItem="menuItem" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <Footer />
</template>
<script setup>
import SchoolHeader from '@/components/SchoolHeaderCopy.vue';
import Footer from '@/components/Footer.vue';
import { ref, onMounted, computed } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import breadCrumb from './components/breadCrumb.vue';
import widgetArea from './components/widgetArea.vue';
import { useMenuStore } from '@/stores/menuStore';
import { pMenuItems } from '@/router/primary';
import profileImg from '@/assets/images/jianjie.png'
import { getCultureList } from '@/api/api.js';
const route = useRoute();
const menuStore = useMenuStore();
const pTitle = ref('');
const path = ref('/');
function findParent(data, targetCategory) {
    for (const item of data) {
        if (item.children) {
            const foundChild = item.children.find(child =>
                child.link.includes(`category=${targetCategory}`)
            );
            if (foundChild) return item;

            const nestedResult = findParentName(item.children, targetCategory);
            if (nestedResult) return nestedResult;
        }
    }
    return null;
}
const name = ref()
const getInfo = () => {
    const item = findParent(pMenuItems,route.query.category)
    let menuItem = []
    if (item.children) {
        menuItem = item.children.map((item, index) => {
            let path = item.link
            let active = false
            if (item.link.includes(route.query.category)) {
                active = true
                name.value = item.name
            }
            return {
                name: item.name,
                path: path,
                active: active
            }
        })
    }
    return menuItem
}
const menuItem = getInfo();
const pageType = ref(route.query.pageType ? route.query.pageType : 1);

const historyList = ref([

])
const noticeList = ref([])
// 定义菜单数据
const menuItems = menuStore.menuItems
function findParentName(data, targetCategory) {
    for (const item of data) {
        if (item.children) {
            const foundChild = item.children.find(child =>
                child.link.includes(`category=${targetCategory}`)
            );
            if (foundChild) return item.name;

            const nestedResult = findParentName(item.children, targetCategory);
            if (nestedResult) return nestedResult;
        }
    }
    return null;
}
function getPTitle(category) {
        const parentName = findParentName(pMenuItems, category);
        pTitle.value = parentName
}
getPTitle(route.query.category)
onMounted(() => {
    function removeHTMLTags(str) {
        if (str) {
            return str.replace(/<[^>]*>/g, '');
        }
        return '';
    }
   
    getCultureList(route.query.category, route.query.type,route.query.haveContent).then((res) => {
        noticeList.value = res.data.map((item) => {
            return {
                ...item,
                url: `/SchoolContentDetails?category=${route.query.category}&pageType=${route.query.pageType}&pTitle=${pTitle.value}&articleId=${JSON.stringify(item.articleId)}&type=${route.query.type}`,
                title: item.title,
                content: route.query.haveContent?item.content:removeHTMLTags(item.content ? item.content : ''),
                image: item.cover,
            }
        })
        historyList.value = res.data.map((item) => {
            return {
                ...item,
                url: `/SchoolContentDetails?category=${route.query.category}&pageType=${route.query.pageType}&pTitle=${pTitle.value}&articleId=${JSON.stringify(item.articleId)}&type=${route.query.type}`,
                name: item.title,
                time: item.createTime
            }
        })

    })
})
</script>